import { configureStore } from '@reduxjs/toolkit'

// 导入counter子模块
import counterReducer from './modules/counterStore'
import recommendReducer from '@/views/discover/recommend/store/recommend'

import { useSelector, TypedUseSelectorHook, useDispatch } from 'react-redux'

// 创建根store组合子模块
const store = configureStore({
  reducer: {
    // 注册子模块
    counter: counterReducer,
    recommend: recommendReducer
  }
})

// 作用：当我们在组件中使用store中的state时，指定state的类型
type GetStateFnType = typeof store.getState
type IRootState = ReturnType<GetStateFnType>
type DispatchType = typeof store.dispatch

// 进一步优化：获取state时无需指定类型，只需使用我们自己的useSelector获取state即可
export const useAppSelector: TypedUseSelectorHook<IRootState> = useSelector

// 封装我们自己的useAppDispatch
export const useAppDispatch: () => DispatchType = useDispatch

// export const appShallowEqual = shallowEqual

export default store
